<template>
  <div v-show="$route.name == 'download'">
    <!-- 面包屑导航区域 -->
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>下载表格</el-breadcrumb-item>
    </el-breadcrumb>
    <!-- 卡片视图区域 -->
    <el-card style="margin-bottom: 15px;">
      <div style="margin-bottom: 20px;">实时数据</div>
      <el-row class="query">
        <el-button type="warning" @click="downloadExcel('house')" :loading="loading" style="margin-right: 5px;">下载仓库数据</el-button>
      </el-row>
    </el-card>
    <el-card style="margin-bottom: 15px;">
      <div style="margin-bottom: 20px;">特定日期范围历史记录</div>
      <!-- 搜索与添加区域 -->
      <el-row class="query">
        <el-col>
          <el-date-picker v-model="rangedDate"
            type="daterange"
            value-format='yyyy-MM-dd'
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期">
          </el-date-picker>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="6" class="query">
          <el-alert title="不选择则导出全部数据" type="warning" show-icon></el-alert>
        </el-col>
      </el-row>
      <el-row class="query">
        <el-button type="warning" @click="downloadExcel('order')" :loading="loading" style="margin-right: 5px;">下载订单数据</el-button>
        <el-button type="warning" @click="downloadExcel('show')" :loading="loading" style="margin-right: 5px;">下载展厅数据</el-button>
        <el-button type="warning" @click="downloadExcel('purchase')" :loading="loading" style="margin-right: 5px;">下载采购记录</el-button>
      </el-row>
    </el-card>
    <el-card style="margin-bottom: 15px;">
      <div style="margin-bottom: 20px;">月末数据记录</div>
      <!-- 搜索与添加区域 -->
      <el-row class="query">
        <el-col :span="6">
          <el-date-picker
            v-model="month"
            type="month"
            :clearable="false"
            value-format='yyyy-MM'
            :picker-options="pickerOptions"
            placeholder="选择月">
          </el-date-picker>
        </el-col>
      </el-row>
      <el-row class="query">
        <el-button type="warning" @click="downloadExcel('inOutStatistics')" :loading="loading" style="margin-right: 5px;">商品进出统计</el-button>
        <el-button type="warning" @click="downloadExcel('houseStatistics')" :loading="loading" style="margin-right: 5px;">月底仓库记录</el-button>
        <el-button type="warning" @click="downloadExcel('orderStatistics')" :loading="loading" style="margin-right: 5px;">订单明细统计</el-button>
      </el-row>
    </el-card>
  </div>
</template>
<script>
import moment from 'moment'
export default {
  data() {
    return {
      rangedDate: null,
      loading: false,
      month: '',
      pickerOptions: {
        disabledDate(time) {
          let a = moment().subtract(1, 'month').format('YYYY')
          let b = moment().subtract(1, 'month').format('M')
          return time.getMonth() > b || time.getFullYear() != a
        }
      }
    }
  },
  mounted() {
    this.month = moment().subtract(1, 'month').format('YYYY-MM')
  },
  methods: {
    downloadExcel(type) {
      let params = {}
      if (this.rangedDate != null) {
        params.startDate = this.rangedDate[0]
        params.endDate = this.rangedDate[1]
      } else {
        params.startDate = ''
        params.endDate = ''
      }
      params.month = this.month
      params.isMonth = 0
      var url = ''
      var fileName = ''
      this.loading = true
      if (type === 'order') {
        url = 'export-order'
        fileName = '慧弈明细-订单表.xlsx'
      } else if (type === 'show') {
        url = 'export-show'
        fileName = '慧弈明细-展厅表.xlsx'
      } else if (type === 'purchase') {
        url = 'export-purchase'
        fileName = '慧弈明细-采购表.xlsx'
      } else if (type === 'house') {
        url = 'export-house'
        fileName = '慧弈明细-仓库表.xlsx'
        if (this.month == '') {
          return this.$message.error('请选择月份')
        }
      } else if(type === 'inOutStatistics') {
        url = 'export-inout'
        fileName = '慧弈明细-商品进出统计.xlsx'
        if (this.month == '') {
          return this.$message.error('请选择月份')
        }
      } else if (type === 'houseStatistics') {
        url = 'export-house'
        params.isMonth = 1
        fileName = '慧弈明细-仓库现存.xlsx'
        if (this.month == '') {
          return this.$message.error('请选择月份')
        }
      } else if(type === 'orderStatistics') {
        url = 'export-order'
        params.isMonth = 1
        fileName = '慧弈财务-订单明细.xlsx'
        if (this.month == '') {
          return this.$message.error('请选择月份')
        }
      }
      this.$http.post(url, params, { type: 'json',responseType:'blob' }).then(res => {
        if (res.status === 200) {
          const blob = res.data
          const reader = new FileReader()
          reader.readAsDataURL(blob)
          reader.onload = (e) => {
            const a = document.createElement('a')
            a.download = fileName
            a.href = e.target.result
            a.click()
          }
          this.loading = false
          return this.$message.success('导出成功')
        }
        this.loading = false
        return this.$message.error(res.msg)
      }).catch (() => {
        this.loading = false
        return this.$message.error('导出失败')
      })
    }
  }
}
</script>
<style scoped>
  .query {
    margin-bottom: 10px;
  }
</style>